---
const platform = "github";
const username = "withastro";
import Social from "./Social.astro";
---

<footer>
  <p>
    在 <a href={`https://www.${platform}.com/${username}`}>{platform}</a> 上，了解有关我的项目的更多信息！
  </p>
  <Social platform="twitter" username="astrodotbuild" />
  <Social platform="github" username="withastro" />
  <Social platform="youtube" username="astrodotbuild" />
</footer>

<style>
  footer {
    margin-top: auto;
    padding: 2rem 1rem;
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    text-align: center;
    color: #6c757d;
    font-size: 0.9rem;
  }

  footer a {
    color: #007bff;
    text-decoration: none;
    font-weight: 500;
  }

  footer a:hover {
    text-decoration: underline;
    color: #0056b3;
  }

  @media (max-width: 768px) {
    footer {
      padding: 1.5rem 0.5rem;
      font-size: 0.8rem;
    }
  }
</style>
